<template>
  <div class="bpmn-top">
    <div class="left">
      <!-- <LeftOutlined class="pr-1" @click="handleClose" />
      <span>请假申请-流程设计器 </span> -->
    </div>
    <div class="right">
      <Button type="primary" ghost class="mr-4" @click="handleSubmit" :loading="spinning">
        <!-- <Icon icon="akar-icons:file" /> -->
        保存</Button
      >
      <!-- <Previews />
      <Imports />
      <Exports /> -->
      <Button @click="handleClose">返回</Button>
    </div>
  </div>
</template>
<script lang="ts" setup name="BpmnTop">
  // import { Icon } from '/@/components/Icon';

  // import { LeftOutlined } from '@ant-design/icons-vue';
  import { Button } from 'ant-design-vue';
  //import Imports from '/@/components/BpmnChart/src/components/Toolbar/components/Imports';
  //import Exports from '/@/components/BpmnChart/src/components/Toolbar/components/Exports';
  //import Previews from '/@/components/BpmnChart/src/components/Toolbar/components/Previews';
  const emit = defineEmits(['close', 'submit']);
  defineProps({
    spinning: {
      type: Boolean,
      default: false,
    },
  });
  function handleClose() {
    emit('close');
  }
  function handleSubmit() {
    emit('submit');
  }
</script>
<style lang="less" scoped>
  .bpmn-top {
    display: flex;
    justify-content: space-between;
    align-items: center;

    .left {
      color: rgba(43, 99, 161, 1);
    }

    .right {
      display: flex;
      align-items: center;
      margin-right: 12px;
    }
  }
</style>
